﻿@model Himall.Web.Areas.SellerAdmin.Models.ShopBonusModel
<script src="~/Scripts/jquery.himallUpload.js"></script>
<link rel="stylesheet" type="text/css" href="~/Content/bootstrap-datetimepicker.min.css">
<script type="text/javascript" src="~/Scripts/bootstrap-datetimepicker.js"></script>
<script type="text/javascript" src="~/Scripts/bootstrap-datetimepicker.zh-CN.js"></script>
<style>
    input[type="radio"] {
        margin-top: 9px;
    }

    .w50 {
        width: 50px;
    }
</style>

<div class="container">
    <ul class="nav nav-tabs-custom clearfix">
        <strong>红包管理</strong>
        <li><a href="/SellerAdmin/ShopBonus/Management">管理</a></li>
        <li class="active"><a>新增</a></li>
        <li><a href="@Url.Action("BuyService")">服务购买</a></li>
    </ul>

    @using( Html.BeginForm( "Add" , "ShopBonus" , new { Area = "SellerAdmin" } , FormMethod.Post , new { id = "BonusForm" , @class = "form-horizontal" } ) )
    {
        <div class="form-group">
            <label for="" class="col-sm-2 control-label"></label>
            <div class="col-sm-10">
                <p class="help-default">说明：随机红包为商家提供类似滴滴打车红包、饿了么红包等可在微信中传播营销工具，可极大提高店铺的二次曝光率</p>
            </div>
        </div><br />

        <div class="form-group">
            <label for="" class="col-sm-2 control-label">活动名称：</label>
            <div class="col-sm-3">
                @Html.TextBoxFor( p => p.Name , new { @class = "form-control input-sm" , @maxlength = "20" } )
            </div>
        </div>

        <div class="form-group">
            <label for="" class="col-sm-2 control-label">红包个数：</label>
            <div class="col-sm-3">
                @Html.TextBoxFor( p => p.Count , new { @class = "form-control input-sm" , @onkeypress = "return (/[\\d.]/.test(String.fromCharCode(event.keyCode)))" } )
            </div>
            <div class="col-sm-6">
                <p class="help-default">会员获得红包并分享出去后可被领取到的总个数</p>
            </div>
        </div>

        <div class="form-group">
            <label for="" class="col-sm-2 control-label">随机范围：</label>
            <div class="col-sm-3">
                @Html.TextBoxFor( p => p.RandomAmountStart , new { @class = "w50" , @onkeypress = "return (/[\\d.]/.test(String.fromCharCode(event.keyCode)))" } ) 至
                @Html.TextBoxFor( p => p.RandomAmountEnd , new { @class = "w50" , @onkeypress = "return (/[\\d.]/.test(String.fromCharCode(event.keyCode)))" } ) 元
            </div>
        </div>

        <div class="form-group">
            <label for="" class="col-sm-2 control-label">使用条件：</label>
            <div class="col-sm-3">
                @Html.RadioButtonFor( p => p.UseState , ( int )Himall.Model.ShopBonusInfo.UseStateType.FilledSend , new { @name = "UseState" , @id = "rdi1" , @Checked = "checked" } )
                <label for="rdi1">满</label>
                @Html.TextBoxFor( p => p.UsrStatePrice , new { @class = "w50" , @onkeypress = "return (/[\\d.]/.test(String.fromCharCode(event.keyCode)))" } ) <br />
                @Html.RadioButtonFor( p => p.UseState , ( int )Himall.Model.ShopBonusInfo.UseStateType.None , new { @name = "UseState" , @id = "rdi2" } )
                <label for="rdi1">无限制</label>
            </div>
        </div>

        <div class="form-group">
            <label for="" class="col-sm-2 control-label">发放方式：</label>
            <div class="col-sm-3">
                <label for="rdi1">购物满</label>
                @Html.TextBoxFor( p => p.GrantPrice , new { @class = "w50" , @onkeypress = "return (/[\\d.]/.test(String.fromCharCode(event.keyCode)))" } ) 元
            </div>
            <div class="col-sm-6">
                <p class="help-default">订单实付金额达到设定的值可获得，0元代表任何付完款的订单均可获得红包</p>
            </div>
        </div>

        <div class="form-group">
            <label for="" class="col-sm-2 control-label">活动开始时间：</label>
            <div class="col-sm-3">
                @Html.TextBoxFor( p => p.DateStart , new { @class = "form-control input-sm start_datetime" } )
				<i class="glyphicon glyphicon-calendar"></i>
            </div>
        </div>

        <div class="form-group">
            <label for="" class="col-sm-2 control-label">活动截止时间：</label>
            <div class="col-sm-3">
                @Html.TextBoxFor( p => p.DateEnd , new { @class = "form-control input-sm end_datetime" } )
				<i class="glyphicon glyphicon-calendar"></i>
            </div>
            <div class="col-sm-5">
                <p class="help-default">活动时间内才能够发放红包</p>
            </div>
        </div>

        <div class="form-group">
            <label for="" class="col-sm-2 control-label">红包有效期限：</label>
			<!--<label for="rdi1">至</label>-->
			<div class="col-sm-5">
                <div class="row">
                    <div class="col-sm-6">
						@Html.TextBoxFor( p => p.BonusDateStart , new { @class = "form-control input-sm start_datetime" } )
                        <i class="glyphicon glyphicon-calendar"></i>
                    </div>
                    <div class="col-sm-6">
						@Html.TextBoxFor( p => p.BonusDateEnd , new { @class = "form-control input-sm end_datetime" } )
                        <i class="glyphicon glyphicon-calendar"></i>
                    </div>

                </div>
            </div>
        </div>

        <div class="form-group">
            <label for="" class="col-sm-2 control-label">分享标题：</label>
            <div class="col-sm-3">
                @Html.TextBoxFor( p => p.ShareTitle , new { @class = "form-control input-sm" , @maxlength = "20" } )
            </div>
            <div class="col-sm-6">
                <p class="help-default">红包被分享或发送出去后链接的名称，如：火拼双11，百万礼券疯狂抢</p>
            </div>
        </div>

        <div class="form-group">
            <label for="" class="col-sm-2 control-label">分享详情：</label>
            <div class="col-sm-3">
                @Html.TextAreaFor( p => p.ShareDetail , new { @class = "form-control input-sm" , @maxlength = "60" } )
            </div>
            <div class="col-sm-6">
                <p class="help-default">红包被发送出去后链接的详情描述</p>
            </div>
        </div>

        <div class="form-group">
            <label for="" class="col-sm-2 control-label">分享图标：</label>
            <div class="col-sm-3">
                <div id="upload-img" class="form-group upload-img"></div>
            </div>
            <div class="col-sm-5">
                <p class="help-default">活动被分享出去的链接图标</p>
            </div>
        </div>

        <div class="form-group">
            <label for="" class="col-sm-2 control-label">同步发布至：</label>
            <div class="col-sm-3">
                @Html.CheckBoxFor( p => p.SynchronizeCard , new { @class = "input-sm" , @checked="true" } )
                <label for="rdi1">微信卡包</label>
            </div>
            <div class="col-sm-6">
                <p class="help-default">如您的微信公众号没有开通卡券权限，将由平台公众号代发券。同步至微信卡包后，需等待微信审核通过，才能领取；</p>
            </div>
        </div>

        <div class="form-group">
            <label for="" class="col-sm-2 control-label">卡券颜色：</label>
            <div class="col-sm-3">
                <select name="CardColor" id="CardColor" class="form-control input-sm">
                    @foreach( System.Collections.DictionaryEntry item in Himall.Model.WXCardLogInfo.WXCardColors )
                    {
                        <option value="@(item.Key)" style="background:@(item.Value);color:#fff;">@(item.Key)</option>
                    }
                </select>
            </div>
        </div>

        <div class="form-group">
            <label for="" class="col-sm-2 control-label">卡券标题：</label>
            <div class="col-sm-3">
                @Html.TextBoxFor( p => p.CardTitle , new { @class = "form-control input-sm" , @maxlength = "30" } )
            </div>
            <div class="col-sm-6">
                <p class="help-default">建议填写代金券“减免金额”及自定义内容，描述卡券提供的具体优惠。例如：HiMall 100元代金券;字数上限为9个汉字</p>
            </div>
        </div>

        <div class="form-group">
            <label for="" class="col-sm-2 control-label">副标题 (非必填)：</label>
            <div class="col-sm-3">
                @Html.TextBoxFor( p => p.CardSubtitle , new { @class = "form-control input-sm" , @maxlength = "18" } )
            </div>
            <div class="col-sm-6">
                <p class="help-default">字数上限为18</p>
            </div>
        </div>


        <div class="form-group">
            <label for="" class="col-sm-2 control-label">每人限领：</label>
            <div class="col-sm-3">
                <label for="rdi1">1次</label>
            </div>
        </div>

        <div class="form-group">
            <label for="" class="col-sm-2 control-label">使用范围：</label>
            <div class="col-sm-3">
                <label for="rdi1">全店通用</label>
            </div>
        </div>

        <div class="form-group">
            <div class="col-sm-offset-2 col-sm-10">
                <button type="button" id="subCate" class="btn btn-primary">保 存</button>
            </div>
        </div>
    }
</div>

<script type="text/javascript">
    $( function ()
    {

        $( "#subCate" ).click( function ()
        {
            var loading = showLoading();
            $( this ).attr( 'disabled', "true" );
            if ( check() )
            {
                $.post( "/SellerAdmin/ShopBonus/IsOverDate", { bend: $( "#BonusDateEnd" ).val(), end: $( "#DateEnd" ).val() }, function ( data )
                {
                    loading.close();
                    if ( data )
                    {
                        $( "#subCate" ).removeAttr( "disabled" );
                        $.dialog.tips( '结束日期不能超过购买的服务日期！' );
                    }
                    else
                    {
                        document.getElementById( "BonusForm" ).submit();
                    }
                } );
            }
            else
            {
                loading.close();
                $( "#subCate" ).removeAttr( "disabled" );
            }
            
        } );

        $( 'input:checkbox' ).click( function ()
        {
            if ( $( '#SynchronizeCard' ).is( ':checked' ) )
            {
                $( "#CardColor" ).removeAttr( "disabled" );
                $( "#CardTitle" ).removeAttr( "disabled" );
                $( "#CardSubtitle" ).removeAttr( "disabled" );
            }
            else
            {
                $( "#CardColor" ).attr( "disabled", "true" );
                $( "#CardTitle" ).attr( "disabled", "true" );
                $( "#CardSubtitle" ).attr( "disabled", "true" );
            }
        } )

        $( "#upload-img" ).himallUpload( {
            title: '',
            imageDescript: '',
            imgFieldName: "ShareImg",
            dataWidth: 10
        } );

        $( ".start_datetime" ).datetimepicker( {
            language: 'zh-CN',
            format: 'yyyy-mm-dd',
            autoclose: true,
            weekStart: 1,
            minView: 2
        } );
        $( ".end_datetime" ).datetimepicker( {
            language: 'zh-CN',
            format: 'yyyy-mm-dd',
            autoclose: true,
            weekStart: 1,
            minView: 2
        } );

        $( '#DateStart' ).on( 'changeDate', function ()
        {
            if ( $( "#DateEnd" ).val() )
            {
                if ( $( "#DateStart" ).val() > $( "#DateEnd" ).val() )
                {
                    $( '#DateEnd' ).val( $( "#DateStart" ).val() );
                }
            }

            $( '#DateEnd' ).datetimepicker( 'setStartDate', $( "#DateStart" ).val() );
        } );

        $( '#BonusDateStart' ).on( 'changeDate', function ()
        {
            if ( $( "#BonusDateEnd" ).val() )
            {
                if ( $( "#BonusDateStart" ).val() > $( "#BonusDateEnd" ).val() )
                {
                    $( '#BonusDateEnd' ).val( $( "#BonusDateStart" ).val() );
                }
            }

            $( '#BonusDateEnd' ).datetimepicker( 'setStartDate', $( "#BonusDateStart" ).val() );
        } );


    } )

    function check()
    {
        var end = $.trim( $( "#DateEnd" ).val() );
        var bend = $.trim( $( "#BonusDateEnd" ).val() );
        end = end.replace( /-/g, "/" );
        bend = bend.replace( /-/g, "/" );
        var date = new Date( end );
        var bdate = new Date( bend );

        if ( date > bdate )
        {
            $.dialog.tips( '活动结束日必须小于有效结束日！' );
            return false;
        }

        if ( $.trim( $( "#Name" ).val() ) == "" )
        {
            $.dialog.tips( '活动名称不能为空！' );
            return false;
        }
        var count = $.trim( $( "#Count" ).val() ); 
        if ( count == "" || parseInt(count) <= 0 )
        {
            $.dialog.tips( '红包个数必须大于0！' );
            return false;
        }

        var r_start = $.trim( $( "#RandomAmountStart" ).val() );
        var r_end = $.trim( $( "#RandomAmountEnd" ).val() );
        if ( r_start == "" || r_end == "" || parseFloat( r_start ) <= 0 || parseFloat( r_end ) <= 0 || isNaN(r_start) || isNaN(r_end) )
        {
            $.dialog.tips( '随机金额不能小于0！' );
            return false;
        }
        if ( parseFloat( r_start ) > parseFloat( r_end ) )
        {
            $.dialog.tips( '随机金额起止范围错误！' );
            return false;
        }

        if ( $( 'input[name="UseState"]:checked ' ).val() == "2" )
        {
            var ustateprice = $.trim( $( "#UsrStatePrice" ).val() );
            if ( isNaN(ustateprice) || ustateprice == "" || parseFloat( ustateprice ) <= 0 )
            {
                $.dialog.tips( '使用条件必须大于0！' );
                return false;
            }
        }

        var grantpricr = $.trim( $( "#GrantPrice" ).val() );
        if ( grantpricr == "" || parseFloat( grantpricr ) < 0 )
        {
            $.dialog.tips( '发放条件不能小于0！' );
            return false;
        }

        if ( $.trim( $( "#DateStart" ).val() ) == '' )
        {
            $.dialog.tips( '活动开始日期必填！' );
            return false;
        }
        if ( $.trim( $( "#DateEnd" ).val() ) == '' )
        {
            $.dialog.tips( '活动结束日期必填！' );
            return false;
        }
        if ( $.trim( $( "#BonusDateStart" ).val() ) == '' )
        {
            $.dialog.tips( '有效期必填！' );
            return false;
        }

        if ( $.trim( $( "#ShareTitle" ).val() ) == '' )
        {
            $.dialog.tips( '分享标题必填！' );
            return false;
        }
        if ( $.trim( $( "#ShareDetail" ).val() ) == '' )
        {
            $.dialog.tips( '分享详情必填！' );
            return false;
        }

        if ( $.trim( $( "input[name=ShareImg]" ).val() ) == '' )
        {
            $.dialog.tips( '请上传图片！' );
            return false;
        }

        if ( $( '#SynchronizeCard' ).is( ':checked' ) )
        {
            if ( $.trim( $( "#CardColor" ).val() ) == '' )
            {
                $.dialog.tips( '请选择卡券颜色！' );
                return false;
            }

            if ( $.trim( $( "#CardTitle" ).val() ) == '' )
            {
                $.dialog.tips( '卡券标题必填！' );
                return false;
            }
        }
        return true;
    }
</script>